<template>
  <div>
    <el-tree
      :data="resources"
      show-checkbox
      default-expand-all
      node-key="id"
      ref="lmtree"
      highlight-current
      :check-on-click-node="true"
      :default-checked-keys="ids"
      :props="{
        children: 'children',
        label: 'name'
      }"
    >
    </el-tree>
    <el-button type="primary" @click="save()" class="lm_btn">保存</el-button>
  </div>
</template>
<script>
export default {
  name: "",
  props: {
    roleId: {
      type: Number,
      default: null
    },
    resourceshow: {
      type: Boolean
    }
  },
  data () {
    return {
      resources: [],
      values: [],
      ids: []
    }
  },
  created() {
    this.getResources()
    this.getResourcesByRoleId()
  },
  methods: {
    getResources() {
      this.$axios.get("/ums-resource/list", {}, (response) => {
        this.resources = response.obj
      });  
    },
    save() {
      this.values = []
      const nodes = this.$refs['lmtree'].getCheckedNodes(false,true)
      for(let i = 0; i < nodes.length; i++) {
        this.values.push(nodes[i].id)
      }
      this.$axios.post('/ums-resource-role/add', {roleId: this.roleId,values: this.values},() => {
          this.$emit('update:resourceshow',false)
      },null)
    },
    getResourcesByRoleId() {
      this.$axios.get('/ums-resource-role/list',{roleId: this.roleId},response => {
        this.ids = []
        for (let i = 0; i < response.obj.length; i++) {
          this.ids.push(response.obj[i].resourceId)
        }
      })
    }
  }
}
</script>
<style lang="less" scoped>
  .lm_btn {
    margin-top: 20px;
  }
</style>